<template>
	<view class="">
		<view class="list" v-for="item in list" :key="item.Id" @click="goPage(item)">
			<view class="list__left">
				<view class="list__left--name">{{item.GiftName}}*{{item.BatchScale}}</view>
				<view class="list__left--des">商品兑换</view>
				<view class="tag" style="background-color: #52c41a;" v-if="item.ActiveState == 1">已发货</view>
				<view class="tag" v-else>处理中</view>
			</view>
			<view class="list__right">
				<view class="list__right--top">
					<text style="color: #ff7a45;margin-right: 10rpx;">-{{item.CostScore}}</text>
					<text>积分</text>
				</view>
				<view class="list__right--bottom">{{item.CreateTime}}</view>
			</view>
		</view>
		<no-data v-if="noData"></no-data>
	</view>
</template>

<script>
	import _custom from '@/common/_custom.js'
	import _data from '@/common/_data.js'
	import NoData from '@/components/custom/no-data/no-data.vue'
	
	export default {
		components: {
			NoData
		},
		data() {
			return {
				obsusername: _data.localData('name'),
				pxid: _data.localData('userid'),
				list: [],
				currentpage: 1,
				pagesize: 10,
				noData: false,
				noMore: false,
			}
		},
		onLoad() {
			this.getSubjectGiftChangeRecord();
		},
		onReachBottom() {
			if(!this.noMore) {
				this.currentpage += 1;
				this.getSubjectGiftChangeRecord();
			}
		},
		methods: {
			/**
			 * 获取礼品兑换记录
			 */
			getSubjectGiftChangeRecord() {
				let that = this;
				_custom.getDataJava({
					apiname: 'getSubjectGiftChangeRecord',
					apiparam: {
						obsusername: this.obsusername,
						obspxid: this.pxid,
					},
					success(res) {
						if(res.length < that.pagesize) that.noMore = true;
						if(that.currentpage == 1 && !res.length) {
							that.noMore = false;
							that.noData = true;
							that.list = [];
							return
						}
						that.list.push(...res);
					},
				})
			},
			init() {
				this.currentpage = 1;
				this.noMore = false;
				this.noData = false;
				this.list = [];
			},
			goPage(v) {
				uni.navigateTo({
					url: '/pages/home/child/subject-gift/index?data=' + JSON.stringify(v)
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.list {
		padding: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #fff;
		border-bottom: 1rpx solid #eee;
		
		&__left {
			
			&--name {
				font-size: 33rpx;
			}
			
			&--des {
				font-size: 26rpx;
				color: #aaa;
			}
		}
		
		&__right {
			
			&--top {
				font-size: 30rpx;
				color: #aaa;
			}
			
			&--bottom {
				font-size: 25rpx;
				color: #aaa;
			}
		}
	}
	
	.tag {
		background-color: #4096ff;
		padding: 3rpx 8rpx;
		color: #fff;
		font-size: 25rpx;
		border-radius: 10rpx;
		display: inline-block;
	}
</style>
